<template>
    <div id="city">
        <div class="left">
            <div>
                <p>热门城市</p>
                <p>
                    <span>北京</span>
                    <span>上海</span>
                    <span>天津</span>
                    <span>合肥</span>
                    <span>郑州</span>
                </p>
            </div>
            <div>
                <a name="a"><p>A</p></a>
                <p>阿克苏</p>
                <p>安康</p>
                <p>安庆</p>
            </div>
            <div name="b">
                <a name="a"><p>B</p></a>
                <p>白山</p>
                <p>白城</p>
                <p>宝鸡</p>
            </div>
            <div name="c">
                <a name="a"><p>C</p></a>
                <p>沧州</p>
                <p>长春</p>
                <p>昌吉</p>
            </div>
            <div name="d">
                <a name="a"><p>D</p></a>
                <p>大理</p>
                <p>大连</p>
                <p>大庆</p>
            </div>
            <div name="e">
                <a name="e"><p>E</p></a>
                <p>鄂尔多斯</p>
                <p>恩施</p>
                <p>鄂州</p>
            </div>
        </div>
        <div class="right">
            <p><a href="#a">A</a></p>
            <p><a href="#b">B</a></p>
            <p><a href="#c">C</a></p>
            <p><a href="#d">D</a></p>
            <p><a href="#e">E</a></p>
        </div>
        
    </div>
</template>
<script>
export default {
    name:'City'
}
</script>
<style scoped>
a{
    color: #000;
    text-decoration: none;
}
p{
    line-height: 35px;
    padding-left: 10px;
}
.left{
    float: left;
    border-right: 1px solid #ccc;
    width: 90%;
    background: #fff5f0;
}
.right{
    /* float: left;
    width: 8%;
    padding-top: 66%; */
    position: fixed;
    right: 10px;
    top: 40%;
}
#city{
    overflow: hidden;
    padding-bottom: 50px;
}
.left div p:first-child{
    background: #f0f0f0;
}
.left span{
    display: inline-block;
    width: 80px;
    line-height: 35px;
    height: 35px;
    background: white;
    margin: 10px;
    border: 1px solid #ccc;
    text-align: center;
}
.left div:first-child{
    margin-top: 20px;
}

</style>